<template>
  <el-drawer v-model="drawer" class="drawer-layout" size="400px" title="设置扩容参数" direction="rtl" :before-close="close"
    :close-on-click-modal="false">
    <div class="info-container">
      <div class="info-container_body">
        <div class="form-section">
          <el-form ref="refFrom" label-position="top" :model="form.model">
            <AgelFormGrid :items="form.items" :span="24" :gutter="16">
            </AgelFormGrid>
          </el-form>
        </div>
      </div>
      <div class="info-container_footer">
        <el-button @click="close">取消</el-button>
        <el-button type="primary" @click="handleSubmit">确定</el-button>
      </div>
    </div>

  </el-drawer>
</template>

<script setup name="RecordAdd" lang="ts">
import { setExpansion } from '@/api/station/usage/index';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const defaultModel = () => ({
  stationId: '',
  stationName: '',
  pmaxThreshold: '',
  pminThreshold: '',
  softExpansion: 0,
  plowDays: '',
})
const drawer = ref(false)
const form = reactive({
  model: defaultModel(),
  items: [
    { prop: "stationName", label: "站房名称", attrs: { disabled: true }, },
    { prop: "pmaxThreshold", label: "最大压力上限（帕）", attrs: { type: 'number' }, },
    { prop: "pminThreshold", label: "最低压力下限（帕）", attrs: { type: 'number' }, },
    { prop: "softExpansion", label: "是否启用软扩容", required: true, slot: 'el-switch', attrs: { activeValue: 1, inactiveValue: 0, }, },
    { prop: "plowDays", label: "欠压持续天数", attrs: { type: 'number' }, },
  ],
})
const loading = ref(false)
const refFrom = ref<ElFormInstance>()
const emits = defineEmits(['close', 'success'])

const openSet = (row) => {
  Object.assign(form.model, row)
  console.log(row, form.model)
  drawer.value = true
}
/** 取消 */
const close = () => {
  drawer.value = false
  form.model = defaultModel()
  emits('close')
}
/** 确认 */
const handleSubmit = async () => {
  if (!refFrom.value) return
  refFrom.value.validate((valid, fields) => {
    if (valid) {
      requestAdd()
    } else {
      console.log('error submit!', fields)
    }
  })
}
const requestAdd = async () => {
  loading.value = true
  let res = await setExpansion(form.model.stationId, form.model)
  loading.value = false
  if (res.code == 200) {
    proxy?.$modal.msgSuccess('操作成功！')
    emits('success')
    close()
  } else {
    proxy?.$modal.msgError(res.msg || '操作失败！')
  }
}
defineExpose({ openSet })
</script>
